<template>
    <dl>
        <dt>
            <img :src="item.avatar" alt="">
        </dt>
        <dd>
            <h3>{{item.title}}</h3>
            <p><span>{{item.author}}</span> <span>{{item.category.name}}</span> <span>连载</span></p>
            <p>{{item.summary}}</p><br>
            <span class="babeil" @click="babeil(item.id)">书籍详情</span>
            <add :status="item.status" :id="item.id"></add>
        </dd>
    </dl>
</template>

<script>
import Add from "@/components/add"
export default {
    components:{
        Add
    },
    props:["item"],
    data(){
        return {
            
        }
    },
    
    methods:{
        babeil(id){
            this.$emit("babeil",{id})
        }
    },
    created(){
        
    }
}
</script>

<style lang="scss">
   dl{
       display: flex;
       .babeil{
           padding: 5px 10px;
           background:red;
           color:#fff;
           cursor: pointer;
       }
   }
</style>
